<template>
	<el-card class="layout-query">
		<el-form ref="queryRef" :inline="true" :model="state.queryForm" @keyup.enter="getDataList()">
			<el-form-item label="标准名称或编号" prop="standardNameOrNumber">
				<el-input v-model="state.queryForm.standardNameOrNumber" placeholder="请输入" clearable />
			</el-form-item>
			<el-form-item label="操作时间" prop="date">
				<el-date-picker
					v-model="state.date"
					type="datetimerange"
					value-format="YYYY-MM-DD HH:mm:ss"
					format="YYYY-MM-DD HH:mm:ss"
					nge-separator="至"
					start-placeholder="开始日期"
					end-placeholder="结束日期"
					clearable
				/>
			</el-form-item>
			<el-form-item>
				<el-button icon="Search" type="primary" @click="search()">查询</el-button>
			</el-form-item>
			<el-form-item>
				<el-button icon="RefreshRight" @click="reset()">重置</el-button>
			</el-form-item>
		</el-form>
	</el-card>
	<el-card>
		<el-table v-loading="state.dataListLoading" :data="dataList" stripe class="layout-table" @selection-change="selectionChangeHandle">
			<el-table-column type="index" label="序号" header-align="center" align="center" width="60"></el-table-column>
			<el-table-column prop="operationType" label="操作类型" header-align="center" align="center"></el-table-column>
			<el-table-column prop="standardNumber" label="标准编号" header-align="center" align="center"></el-table-column>
			<el-table-column prop="standardName" label="标准名称" header-align="center" align="center"></el-table-column>
			<el-table-column prop="oeprationTime" label="时间" header-align="center" align="center"></el-table-column>
			<el-table-column prop="operationUser" label="操作人" header-align="center" align="center"></el-table-column>
			<el-table-column prop="ipAddress" label="ip" header-align="center" align="center"></el-table-column>
			<el-table-column prop="operationResult" label="执行结果状态" header-align="center" align="center"></el-table-column>
		</el-table>
		<el-pagination
			:current-page="state.pageNum"
			:page-size="state.pageSize"
			:total="state.total"
			layout="total, sizes, prev, pager, next, jumper"
			@size-change="sizeChangeHandle"
			@current-change="currentChangeHandle"
		>
		</el-pagination>
	</el-card>
</template>
<script setup lang="ts">
import { GetLogListApi } from '@/api/standard/maintenance'
import { onMounted, reactive, ref } from 'vue'
const state = reactive({
	dataListUrl: '/sys/post/page',
	deleteUrl: '/sys/post',
	queryForm: {
		standardNameOrNumber: '',
		startOperationTime: '',
		endOperationTime: ''
	},
	date: [],
	pageNum: 1,
	pageSize: 10,
	total: 1,
	dataListLoading: false
})

const dataList = ref([])

const search = () => {
	state.pageNum = 1
	getDataList()
}

const getDataList = async () => {
	if (state.date && state.date.length > 0) {
		state.queryForm.startOperationTime = state.date[0]
		state.queryForm.endOperationTime = state.date[1]
	}
	state.dataListLoading = true
	await GetLogListApi({
		pageNum: state.pageNum,
		pageSize: state.pageSize,
		...state.queryForm
	}).then(res => {
		state.dataListLoading = false
		dataList.value = res.data.list || []
		state.total = res.data.total || 0
	})
}

const reset = () => {
	state.date = []
	state.queryForm = {
		standardNameOrNumber: '',
		startOperationTime: '',
		endOperationTime: ''
	}
	state.pageNum = 1
	getDataList()
}

onMounted(() => {
	getDataList()
})

const addOrUpdateHandle = () => {}
const deleteBatchHandle = () => {}
const selectionChangeHandle = () => {}
const sizeChangeHandle = (e: number) => {
	state.pageSize = e
	state.pageNum = 1
	getDataList()
}
const currentChangeHandle = (e: number) => {
	state.pageNum = e
	getDataList()
}
const getDataListParent = () => {}
</script>
